<template>
	<scroll-view style="background-color: #f2f5f7;">
		<view style="width: 100%;" v-for="(item,index) in userInfo">

			<view class="userItem" :key="index"
				style="height: 400rpx;background-color:white;margin-top:20rpx;margin-left: 10rpx;margin-right: 10rpx;margin-bottom: 20rpx;border-radius: 50rpx;padding-top: 30rpx;">
				<view style="display: flex;align-items: center;padding-left: 50rpx;margin-bottom: 30rpx;">
					<p>卖家：</p>
					<image :src="imgUrlConfig+item.sell.img[0]" mode="" style="width: 50rpx;height: 50rpx;"></image>
					<span
						style="display: inline-block;padding-left: 12rpx;font-weight: bold;font-size:28rpx ;line-height:50rpx;">{{item.sell.nickName}}</span>
				</view>
				<view style="display: flex;align-items:center;justify-content: space-around;">
					<image :src="imgUrlConfig+item.articleId.images[0]" mode=""
						style="width: 200rpx;height: 200rpx; border-radius: 30rpx;"></image>
					<view style="width: 320rpx;">
						<p style="display: inline-block;font-size: 28rpx;width:320rpx;">
							{{item.articleId.desc.substring(0,20)+"..."}}
						<p style="display: block;margin-top:100rpx;font-weight: bold;">
							{{timingRen(item.articleId.time)}}购入
						</p>
						</p>
						<!--  -->
					</view>
					<view style="text-align: center;width: 100rpx;">
						<p style="font-size: 28rpx;"><span style="font-size: 24rpx;">￥</span><span
								style="color:red;">{{item.articleId.price}}</span></p>
					</view>

				</view>
				<view style="display: flex;flex-direction: row-reverse;padding-right: 20rpx;">
					<view @click="deleteOrderInfo(item._id)"
						style="margin-top:20rpx;display: inline-block;display:flex;width:160rpx;background-color:#78cdd1;border-radius:26rpx;line-height:60rpx;justify-content: center;font-size: 26rpx;">
						删除订单</view>
				</view>
			</view>
		</view>
	</scroll-view>
</template>

<script>
	import timeFun from '../../../utils/time.js'
	export default {
		created() {
			const userNow = this.$store.state.user;
			this.userId = userNow._id;
			uni.request({
				url: `http://localhost:3001/orders/orderFind/userId=${userNow._id}`,
				method: 'GET',
				success: (res) => {
					console.log(res.data);
					this.userInfo = res.data
				}
			});
		},
		data() {
			return {
				// 请求图片的
				imgUrlConfig: 'http://localhost:3002',
				userId: "",
				userInfo: {},
			}
		},
		methods: {
			timingRen(time) {
				return timeFun.getFormatTime((new Date(time)).getTime());
			},
			deleteOrderInfo(_id) {
				uni.showModal({
					title: '提示',
					content: '确定删除订单？',
					success: (res) => {
						if (res.confirm) {
							uni.request({
								url: `http://localhost:3001/orders/orderDel/${_id}`,
								method: 'DELETE',
								success: (res) => {
									console.log(res.data)
								}
							});
							// 提示删除成功
							uni.showToast({
								title: '删除成功',
								duration: 2000
							});
							// 重新获取页面数据
							let userNowId = this.$store.state.user._id;
							uni.request({
								url: `http://localhost:3001/orders/orderFind/userId=${userNowId}`,
								method: 'GET',
								success: (res) => {
									console.log("res.data----->>>>>>>", res.data);
									this.userInfo = res.data
								}
							});

						} else if (res.cancel) {
							console.log(res)
						}
					}
				});

				// const userNow = this.$store.state.user;
				// uni.request({
				// 	url: `http://localhost:3001/orders/userId=${userNow._id}`,
				// 	method: 'GET',
				// 	success: (res) => {
				// 		console.log(res.data);
				// 		this.userInfo = res.data
				// 	}
				// });

			}
		}
	}
</script>

<style scoped>
	body {
		background-color: #f2f5f7;
	}

	.userItem {}
</style>
